<template>
  <div class="downLoad_app_box">
    <div class="center_button_box">
      <div class="center_top_button">
        <van-button size='large' @click="goDownLoadAPP">安卓版本下载</van-button>
      </div>
      <div class="center_bottom_button">
        <van-button size='large' @click="goDownLoadAPP">iOS版本下载</van-button>
      </div>
    </div>
  </div>
</template>

<script>

export default {
  data() {
    return {}
  },
  methods: {
    goDownLoadAPP(){
      const conf = require('../../utils/conf')
      const baseURL = conf.baseURL
      const baseURLNew = baseURL.split('#/')[0]
      let u = navigator.userAgent;
      let isAndroid = u.indexOf("Android") > -1 || u.indexOf("Adr") > -1; //android终端
      let isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
      if (isAndroid) {
          window.location.href ='cncomdo1cookcarc://index';   // 打开app的协议，有安卓同事提供
          window.setTimeout(() => {
            window.location.href = `${baseURLNew}chezhu_2021_12_13_01.apk`;   // 打开app的协议，有安卓同事提供
            // window.location.href = `https://hnbin.mynatapp.cc/capp/chezhu_2021_12_13_01.apk`;   // 打开app的协议，有安卓同事提供
          }, 2000);
        
      }
      if (isIOS) {
          let ifr = document.createElement("iframe");
          ifr.src ='cncomdo1cookcarc://index';  // 打开app的协议，有ios同事提供
          ifr.style.display = "none";
          document.body.appendChild(ifr);
          window.setTimeout(() => {
            document.body.removeChild(ifr);
            window.location.href ='https://itunes.apple.com/cn/app/id1518539971?mt=8';   // 打开app的协议，有安卓同事提供
          }, 2000);
      }
    }
  },
  created() {
    document.title = "车煮App";
  },
}
</script>

<style lang="less" scoped>
.downLoad_app_box{
  width: 100vw;
  height: 100vh;
  background-image: url('../../assets/image/downloadAppbgi.png');
  background-size: 100% 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  .center_button_box{
    padding-top: 138px;

    align-items: center;
    .center_top_button{
      display: flex;
      justify-content: center;
      margin-bottom: 20px;
      button{
        width: 327px;
        height: 68px;
        background: linear-gradient(180deg, #FFFFFF 0%, #FFFDF5 100%);
        box-shadow: 0px 4px 8px 0px rgba(190, 100, 0, 0.24);
        border-radius: 16px;
      }
    }
    .center_bottom_button{
      display: flex;
      justify-content: center;
      button{
        width: 327px;
        height: 68px;
        background: linear-gradient(180deg, #FFFFFF 0%, #FFFDF5 100%);
        box-shadow: 0px 4px 8px 0px rgba(190, 100, 0, 0.24);
        border-radius: 16px;
      }
    }
  }
}
</style>